<template>
	<view class="ejectP">
		<u-navbar :is-back="true" title="提现" back-text=''>
			<view class="slot-right" style="width: 100%; display: flex; justify-content: flex-end">
				<view style="padding: 0rem 0.5rem;display: flex;
align-items: center;">
					<view @click="withDrawNotes" style="
font-size: 0.75rem;
font-family: PingFang SC;
font-weight: 300;
color: #02AF74;">提现记录</view>
					<!-- <image style="width: 0.7rem;
height: 0.5rem;
padding: 0.3rem;" src="../../../style/image/my/bottomArrow.jpg" alt=""> -->
				</view>
			</view>
		</u-navbar>

		<view class="heads">
			<view style="
font-size: 0.77rem;
font-family: PingFang SC;
font-weight: 300;
color: #656565;">请输入提现金额</view>
			<u-input style="margin:1rem 0rem" v-model="value" type='number' placeholder='¥0.00' />
			<view style="
font-size: 0.77rem;
font-family: PingFang SC;
font-weight: 300;
color: #656565;">可提现金额：{{defaluteInfo.usableBlance}}元</view>

			<view style="display: flex;
justify-content: space-between;">
				<view style="font-size: 0.77rem;
font-family: PingFang SC;
font-weight: 300;
color: #656565;">冻结金额：{{defaluteInfo.freezeMoney}}元</view>
				<view style="font-size: 0.77rem;
font-family: PingFang SC;
font-weight: 300;
text-decoration: underline;
color: #656565;">什么是冻结金额？</view>
			</view>
		</view>

		<view class="tips">
			注：为避免其他代理商设备占用您的底座，影响您的收益，请保
			持账户有足够的余额
		</view>


		<view class="appily">

			<view class="myProlifIcon-title">
				<view class="myProlifIcon"></view>
				<view class="myProlifIcon-text">提现方式</view>
			</view>

			<view class="way">

				<view style="display: flex;
align-items: center;">
					<image style="width:2rem;height:2rem" src="../../style/image/Shome/appily.png" alt="">
						<view style="font-size: 0.83rem;
font-family: PingFang SC;
font-weight: 300;
color: #000000;
margin-left: 0.5rem;">支付宝</view>
				</view>

				<view>
					<u-radio-group v-model="radioValue">
						<u-radio name='1' active-color="#02af74" shape="circle"></u-radio>
					</u-radio-group>
				</view>

			</view>

			<!--        <view class="way" >

            <view style="display: flex;align-items: center;">
                <image style="width:2rem;height:2rem" src="../../style/image/share/weChat.jpg" alt="">
                <view style="font-size: 0.83rem;font-family: PingFang SC;font-weight: 300;color: #000000;margin-left: 0.5rem;" >微信</view>
            </view>

            <view>
           <u-radio-group v-model="radioValue">
	       <u-radio name='2' active-color="#02af74" shape="circle"></u-radio>
           </u-radio-group>
            </view>
            
        </view>
        -->

		</view>


		<view @click="addwithdrawM" :class="defaluteInfo.ifFrozenDrawMoney?'gray':'green'">
			<view style="padding: 0.7rem;
display: flex;align-items: center;">
				<!-- <image style="width: 1rem;" src="../../style/image/cargo/add.jpg" alt=""> -->
				<view v-if="!defaluteInfo.ifFrozenDrawMoney" style="color: white;
margin-left: 0.2rem;">确认提现</view>
				<view v-else="defaluteInfo.ifFrozenDrawMoney" style="color: white;
margin-left: 0.2rem;">冻结提现</view>
			</view>

		</view>




	</view>

</template>

<script lang='ts'>
	import {
		Component,
		Prop,
		Vue,
		Watch,
		Emit
	} from "vue-property-decorator";

	import {
		findUserMoney
	} from '../../utils/uniApi'

	import uNavbar from '../../uview-ui/components/u-navbar/u-navbar.vue'

	import uRadio from '../../uview-ui/components/u-radio/u-radio.vue'

	import uRadioGroup from '../../uview-ui/components/u-radio-group/u-radio-group.vue'

	import uInput from '../../uview-ui/components//u-input/u-input.vue'


	@Component({
		//   @Component  是一个装修器   不可以在下面写语句
		name: "test",
		components: {
			'u-navbar': uNavbar,
			'u-radio-group': uRadioGroup,
			'u-radio': uRadio,
			'u-input': uInput
		}
	})
	export default class extends Vue {
		@Prop({
			type: String, // 父组件传递给子组件的数据类型
			required: false, // 是否必填
			default: " ", // 默认值， 如果传入的是 Object，则要 default: ()=>({}) 参数为函数
		})
		msg!: string;
		public radioValue = "1";

		public value: any = "";

		public ifBindingZfb: any = ""; //支付宝权限

		public thresholdMin: any  = ""; //最小金额

		public thresholdMax: any  = " "; //最大金额

		// public form: any = {
		// 	value: ""
		// }
		// public rules: any = {
		// 	value: [
		// 		// 对value字段进行验证
		// 		{
		// 			min: 5,
		// 			message: '请输入正确的金额',
		// 			trigger: ['change','blur']
		// 		}
		// 	]
		// }
		public defaluteInfo = {
			freezeMoney: '', //	冻结金额
			totalAmount: '', //	总收益
			ktxMoney: '' //可提现金额
		}
		public freeze = '' //冻结
		created() {}

		mounted() {
			//  console.log('父组件传递的参数:',this.$parent)   //暂时不考虑
			//  uni.navigateTo({
			// url: './selectBusin'
			// });
			this.getFindUserMoney()
		}
		// onLoad(options: any) {

		// 	console.log(JSON.parse(options.incomeData));

		// 	console.log('123312')

		// 	this.defaluteInfo = JSON.parse(options.incomeData)

		// }
		//查询用户余额和冻结金额
		getFindUserMoney() {
			let params = {
				userId: uni.getStorageSync("userId") == "" ? "" : parseInt(uni.getStorageSync("userId")),
				type: 0
			}
			findUserMoney(params).then((res: any) => {
				console.log(res, '余额提现')
				this.defaluteInfo = res.data.data
				this.freeze = res.data.data.ifFrozenDrawMoney
				this.ifBindingZfb = res.data.data.ifBindingZfb
				this.thresholdMin = res.data.data.thresholdMin
				this.thresholdMax = res.data.data.thresholdMax
				// console.log(this.ifBindingZfb, this.thresholdMin, this.thresholdMax, '余额提现')
			})
		}
		goejectNextM() {
			console.log("123");
		}

		withDrawNotes() {
			console.log("去提现记录");

			uni.navigateTo({
				url: "../withdraw/withdrwaNotes",
			});

		}

		addwithdrawM() {
			console.log(this.radioValue);
			if (this.freeze) {} else if (this.ifBindingZfb == false) {
				uni.showToast({
					title: '请绑定支付宝',
					duration: 2000,
					icon: "none"
				})
			} else if (this.value < this.thresholdMin) {
				uni.showToast({
					title: '提现金额不能小于最小金额',
					duration: 2000,
					icon: "none"
				})
			} else if (this.value > this.thresholdMax) {
				uni.showToast({
					title: '提现金额不能大于最大金额',
					duration: 2000,
					icon: "none"
				})
			} else {
				let data = {
					userId: uni.getStorageSync("userId") == "" ?
						"" : parseInt(uni.getStorageSync("userId")), //	shopId 或 userId
					type: "0", //申请人关联ID类型（0 代理 ,1 商户,）
					money: this.value, //提现金额
					verifyCode: "", //短信验证码
				};

				uni.navigateTo({
					url: `./sureWithdraw?data=${JSON.stringify(data)}`,
				});

			}

		}
	}
</script>

<style lang="scss" scoped>
	>>>.u-input__input {
		min-height: 38px;
		font-size: 2rem;
	}

	.heads {
		margin: 1rem;
		padding: 1rem;

		box-shadow: 1px 1px 10px 3px rgba(144, 144, 144, 0.1);

		/* box-shadow: 0rem 0rem 1px 1px rgba(0, 0, 0, 0.1); */
		border-radius: 0.3rem;
	}

	.tips {
		font-size: 0.66rem;
		font-family: PingFang SC;
		font-weight: 300;
		color: #656565;
		margin: 1rem;
	}

	.appily {
		margin: 1rem;
	}

	.myProlifIcon-title {
		display: flex;
		align-items: center;
		margin: 1rem 0rem;
	}

	.myProlifIcon-text {
		/* // width: 20.84rem;
    // height: 49.09rem; */
		margin-left: 0.3rem;
	}

	.myProlifIcon-func-content {
		display: flex;
	}

	.myProlifIcon {
		width: 0.17rem;
		height: 0.84rem;
		background: #02b074;
		border-radius: 1rem;
	}

	.myProlifIcon-content {
		height: 7.7rem;
		background: #ffffff;
		box-shadow: 1rem 0.5rem 1rem 0.5rem rgba(154, 154, 154, 0.18);
		border-radius: 0.5rem;
		padding: 1rem;
	}

	.way {
		border-bottom: 1px solid #e5e5e5;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0.5rem 0rem;
	}

	.gray {
		position: absolute;
		bottom: 0;
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		background-color: #DEDEDE;
	}

	.green {
		position: absolute;
		bottom: 0;
		background-color: #02af74;
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
</style>
